<%@ page language="java" contentType="text/html; charset=UTF-8"%>

<!DOCTYPE html>
<html>
<head>
<title>角色主页</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="renderer" content="webkit">
<%@ include file="/WEB-INF/common.jsp"%>

<link href="${path }/resources/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
<link href="${path }/resources/css/animate.css" rel="stylesheet">
<link href="${path }/resources/css/style.css?v=4.1.0" rel="stylesheet">

<!--dataTables css样式-->
<link rel="stylesheet" type="text/css"
	href="${path }/resources/css/jquery.dataTables.min.css">
<!--DataTables button扩展-->
<link rel="stylesheet" type="text/css"
	href="${path }/resources/css/buttons.dataTables.min.css">
<!--模态框  -->
<link href="${path }/resources/css/bootstrap.min.css">

</head>
<body class="gray-bg" style="">
<jsp:include page="/WEB-INF/loginCheck.jsp" />
	<div>
		<h1 style="margin-left:20px">账号列表</h1>
	</div>
	<div class="btn-group" style="margin-top: 5px;margin-left: 15px">
		<!-- 按钮触发模态框 -->
		<button class="btn btn-primary" data-toggle="modal" data-target="#myModal">
			添加
		</button>
	</div>
		<!-- 模态框（Modal） -->
	<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
						&times;
					</button>
					<h4 class="modal-title" id="myModalLabel">
						添加账号
					</h4>
				</div>
				<div class="modal-body">
				<form id="cForm" data-parsley-validate class="form-horizontal form-label-left" >
					<div class="form-group">
						<label class="control-label col-md-3 col-sm-3 col-xs-12"
							for="last-name">支队名称：<span class="required">*</span>
						</label>
						<div class="col-md-6 col-sm-6 col-xs-12">
							<input  id="username" value="" name="phone_number" class="form-control col-md-7 col-xs-12" >
						</div>
					</div>
					<div class="form-group">				
						<label class="control-label col-md-3 col-sm-3 col-xs-12"
							for="first-name">状态：<span class="required">*</span>
						</label>
						<lable style="font-size:20px"><input id="status" value="开启" name="status" type="radio"  style="margin-left:50px;">开启</lable>
						<lable style="font-size:20px" ><input id="status" value="停止" name="status" type="radio"  style="margin-left:100px;">停止</lable>
					</div>
					<div class="form-group">
						<label class="control-label col-md-3 col-sm-3 col-xs-12"
							for="first-name">地址：<span class="required">*</span>
						</label>
						<div class="col-md-6 col-sm-6 col-xs-12">
							<div id="distpicker5">
								<div class="form-group" id="province">
									<label class="sr-only" for="province">Province</label> 
									<select id="province" class="form-control" name="province" disabled></select>
								</div>
								<div class="form-group" id="city">
									<label class="sr-only" for="city">City</label> 
									<select id="city" class="form-control" name="city" ></select>
								</div>
								<div class="form-group" id="district">
									<label class="sr-only" for="district">District</label> 
									<select id="area" class="form-control" name="area" ></select>
								</div>
							</div>
						</div>
					</div>
				</form>
				</div>
				
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭
					</button>
					<button type="button" class="btn btn-primary" onclick="pushPlan()">
						提交
					</button>
				</div>
			</div><!-- /.modal-content -->
		</div><!-- /.modal -->
	</div>
  	<!--表格  -->
 	<div class="col-md-12 col-sm-12 col-xs-12" style="margin-top: 30px">
		<table id="accountList" class="table table-bordered table-striped" style="width:100%">
			<thead>
				<tr>
					<th>支队名称</th>
					<th>账号</th>
					<th>创建时间</th>
					<th>上次修改时间</th>
					<th>状态</th>
					<th>操作</th>
				</tr>
			</thead>
		</table>
	</div>
 
	
	<!-- Peity-->
	<script src="${path }/resources/js/plugins/peity/jquery.peity.min.js"></script>
	
	<!-- Bootstrap table-->
	<script src="${path }/resources/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
	<script src="${path }/resources/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>

	<!-- 自定义js-->
	<script src="${path }/resources/js/content.js?v=1.0.0"></script>
	
	<!-- jQuery Validation plugin javascript-->
    <script src="${path }/resources/js/plugins/validate/jquery.validate.min.js"></script>
    <script src="${path }/resources/js/plugins/validate/messages_zh.min.js"></script>
   
   	<!-- jQuery form  -->
    <script src="${path }/resources/js/jquery.form.min.js"></script>
    
    <!-- layer javascript -->
    <script src="${path }/resources/js/plugins/layer/layer.min.js"></script>
    
    	<!--DataTables 核心 js-->
	<script src="${path }/resources/js/jquery.dataTables.min.js"></script>
	<!--DataTables button扩展-->
	<script
		src="${path }/resources/js/dataTables.buttons.min.js"></script>
	<!--DataTables 导出相关js文件-->
	<script src="${path }/resources/js/buttons.html5.min.js"></script>
	<script src="${path }/resources/js/jszip.min.js"></script>
	<!-- 省市联动 -->
	<script src="${path }/resources/js/distpicker.data.js"></script>
	<script src="${path }/resources/js/distpicker.js"></script>
	<script src="${path }/resources/js/main.js"></script>
    <!-- datatables日期格式化 -->
	<script src="${path }/resources/js/moment.min.js"></script>
	<script type="text/javascript">
	var name;
	var login;
	var phoneNumber;
	$("#name1").change(function(event) {
		name = $(this).val();
	});
	$("#login1").change(function(event) {
		login = $(this).val();
	});
	$("#phonenumber").change(function(event) {
		phoneNumber = $(this).val();
	});

         var data=${personList};
         //然后 DataTables 这样初始化：
         $('#accountList').DataTable( {
             data: data,
            	language: { 
            		"paginate": {
            	          "processing": "正在处理中。。。"
            	        },
            	      //"sProcessing": "处理中...",  
            	      "sLengthMenu": "显示 _MENU_ 项结果",  
            	      "sZeroRecords": "没有匹配结果",  
            	      "sInfo": "显示第 _START_ 至 _END_ 项结果，共 _TOTAL_ 项",  
            	      "sInfoEmpty": "显示第 0 至 0 项结果，共 0 项",  
            	      "sInfoFiltered": "(由 _MAX_ 项结果过滤)",  
            	      "sInfoPostFix": "",  
            	      "sSearch": "搜索:",  
            	      "sUrl": "",  
            	      "sEmptyTable": "表中数据为空",  
            	      "sLoadingRecords": "载入中...",  
            	      "sInfoThousands": ",",  
            	      "oPaginate": {  
            	          "sFirst": "首页",  
            	          "sPrevious": "上页",  
            	          "sNext": "下页",  
            	          "sLast": "末页"  
            	      },  
            	      "oAria": {  
            	          "sSortAscending": ": 以升序排列此列",  
            	          "sSortDescending": ": 以降序排列此列"  
            	      }  
            	  }  ,
               	  "iDisplayLength":15,
            	  "lengthMenu":[10,15,20], 
            	  "columns": [ 
							 { "data": "name" },
							 { "data": "login_id" },
							 { "data": "creation_time" ,
								 "defaultContent": "",
								 "render": function (data, type, row, meta) {
      	            		  		return moment(data).format("YYYY/MM/DD");
								 }},
							 { "data": "last_change_time",
									 "defaultContent": "",
									 "render": function (data, type, row, meta) {
	      	            		  		return moment(data).format("YYYY/MM/DD");
									 }
								 },
							 { "data": "status",
								 "defaultContent": ""	 
								 },
                              {"data": "login_id",
		           	                  "orderable": false, // 禁用排序
		        	                  "defaultContent": "",
		           	                  "render": function (data, type, row, meta) {
		           	                	var a = data;
		           	                	
		           	                	return "<button class='btn btn-primary btn-xs' onclick='showArea(\""+ a + "\")'>更改状态</button>" ;
		           	                  } 
         			   		}]
 
         } );
         
      	//添加账号，点击提交按钮
      	function pushPlan(){
      		var province = $("#province").find("option:selected").text();
     		var city = $("#city").find("option:selected").text();
     		var area = $("#area").find("option:selected").text();   		
      	    var username = $("#username").val();
      	    var status = $("#status").val();
      	    
      	 	$.ajax({
      	  		 url: "/firefighting/Enterprise/addEnterPerson.htm",
      	           type: "POST",
      	           dataType: "json",
      	           data: {
      	          	 "province":province,
      	          	 "city":city,
      	          	 "area":area,
      	          	 "name":username,
      	          	 "status":status,
      	          	 "roleId":10
      	           },
      	           traditional: true,//属性在这里设置
      	           cache: false,
      	           success: function (data)
      	           {if(data.error==1){
      	        	   alert("该市已有支队账号");
      	           }else{
       	          	  var flag = data.userName;
      	          	  alert("账号为:"+flag+"  初始密码为：123456");
      	                window.location.href= "/firefighting/Enterprise/getFirePersonList.htm";   
      	           }
      	         	 
      	           },
      	           error:function(data)
      	           {
      	         	  alert("添加失败");
      	           }
      	       });
      	    
      	}
	</script>
	<script type="text/javascript">
	 function showArea(a) {
		 if (window.confirm('你确定要修改该企业账号状态吗？')) {
			$.ajax({
				url:"/firefighting/Enterprise/changeFireStatus.htm",
				type:"POST",
				dataType:'json',
				data:{
					"account":a,
				},
				success:function(data)
				{
					var flag = data.flag;
					if(flag == true)
						{
						alert("更改状态成功!");  
						window.location.href= "/firefighting/Enterprise/getFirePersonList.htm";  
						}
					else
						{
							alert("更改状态失败!");    						
						}		
				},
					error:function(data)
				{
					alert("保存失败，稍后重试！")
				} 
			});
		      }else {
      	        return false;
      	    }
	    	}
	$('#distpicker5').distpicker({
		  province: '内蒙古自治区',
		  /* city: '',
		  district: '' */
		});
	</script>
 
</body>
</html>